function formatTime(sec) {
  var rtn = `${Math.floor(sec / 60)}`.padStart(2, '0') + `:` + `${Math.floor(sec % 60)}`.padStart(2, '0');
  return rtn == `NaN:NaN` ? `00:00` : rtn;
}

var MokeyPlayer = {
  audioElement: new Audio(),

  status: 'waiting',  // waiting, playing, ended

  loopMode: 'single-loop',

  musicOn: function() {
    MokeyPlayer.audioElement.play();
  },

  musicOff: function() {
    MokeyPlayer.audioElement.pause();
  },

  musicButtonOn: function(button) {
    if (button.classList.contains('waiting')) {
      button.classList.remove('waiting');
    }
    if (!button.classList.contains('playing')) {
      button.classList.add('playing');
    }
  },

  musicButtonOff: function(button) {
    if (button.classList.contains('playing')) {
      button.classList.remove('playing');
    }
    if (!button.classList.contains('waiting')) {
      button.classList.add('waiting');
    }
  },

  musicStatusSync: function(button) {
    if (MokeyPlayer.audioElement.ended) {
      MokeyPlayer.status = 'ended';
      MokeyPlayer.musicButtonOff(button);
    }
    else if (MokeyPlayer.audioElement.paused) {
      MokeyPlayer.status = 'waiting';
      MokeyPlayer.musicButtonOff(button);
    }
    else {
      MokeyPlayer.status = 'playing';
      MokeyPlayer.musicButtonOn(button);
    }
  },

  musicOnOff: function() {
    var musicOnOffButton = document.getElementById("music-on-off");
    if (MokeyPlayer.status == 'waiting' || MokeyPlayer.status == 'ended') {
      MokeyPlayer.status = 'playing';
      MokeyPlayer.musicOn();
      MokeyPlayer.musicButtonOn(musicOnOffButton);
    }
    else {
      MokeyPlayer.status = 'waiting';
      MokeyPlayer.musicOff();
      MokeyPlayer.musicButtonOff(musicOnOffButton);
    }
  },

  currentMusic: [
    "Kalimba - Mr. Scruff",
    "http://two.oss.monkeyhbd.cn/player/picture/kalimba.jpg",
    "http://two.oss.monkeyhbd.cn/player/song/kalimba.mp3"
  ],

  switchMusic: function(musicItem) {
    MokeyPlayer.musicOff();
    console.log(musicItem);
    MokeyPlayer.audioElement.src = musicItem[2];
    console.log(2);
    console.log(document.querySelectorAll("#music-small-img img")[0]);
    document.querySelectorAll("#music-small-img img")[0].src = musicItem[1];
  },

  setTimeLayout: function(nowLiteral, allLiteral) {
    var now = document.getElementById('music-player-time-now');
    var all = document.getElementById('music-player-time-all');
    now.innerHTML = nowLiteral;
    all.innerHTML = allLiteral;
  },

  routine: function() {
    // Sync music on/off status.
    var musicOnOffButton = document.getElementById("music-on-off");
    MokeyPlayer.musicStatusSync(musicOnOffButton);
    // Update music play time layout.
    MokeyPlayer.setTimeLayout(formatTime(MokeyPlayer.audioElement.currentTime), formatTime(MokeyPlayer.audioElement.duration));
    console.log(formatTime(MokeyPlayer.audioElement.duration), formatTime(MokeyPlayer.audioElement.currentTime));
    var trackPlayed = document.getElementById("music-player-ratio-played");
    trackPlayed.style.width = `${MokeyPlayer.audioElement.currentTime / MokeyPlayer.audioElement.duration * 100}%`;
    // Next music.
    if (MokeyPlayer.status == 'ended' && MokeyPlayer.loopMode == 'single-loop') {
      MokeyPlayer.musicOn();
    }
    console.log('a routine');
  },

  init: function() {
    MokeyPlayer.switchMusic(MokeyPlayer.currentMusic);
    setInterval(MokeyPlayer.routine, 500);
  }
}

export {MokeyPlayer};
